﻿
@{
    ViewBag.Title = "编辑入库检";
    Layout = "~/Views/Shared/_LayoutPage.cshtml";

    var statuses = ViewBag.PackInboundInspectStatusEnums as List<KeyValuePair<int, string>>;
}
@section Contents{
    <style>
        .layui-form-label {
            width: 110px;
        }
    </style>
}

<div id="page"></div>

<script type="text/template" id="tplPage">
    <div class="layui-fluid">
        <div class="layui-card">
            <div class="layui-form layui-card-header layuiadmin-card-header-auto">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.PackNo">打包编号：</label>
                        <div class="layui-input-inline">
                            <input type="text" id="txtPackNo" value="@ViewBag.PackNo" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline">
                        <button id="btnSearch" class="layui-btn layuiadmin-btn-list" type="button">
                            <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                        </button>
                        <a id="btndownload" class="layui-btn layuiadmin-btn-list">
                            <i class="layui-icon layui-icon-download-circle layuiadmin-button-btn"></i>
                        </a>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-card">
            <div class="layui-form layui-card-header layuiadmin-card-header-auto">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.InspectResult">检测结果：</label>
                        <div class="layui-input-inline">
                            <select id="selStatus" lay-filter="selStatus" v-model="inspect.Status">
                                @foreach (var item in statuses)
                                {
                                    <option value="@item.Key">@item.Value</option>
                                }
                            </select>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label" v-html="lang.Field.RefuseReason">拒绝原因：</label>
                        <div class="layui-input-inline">
                            <input type="text" id="txtRefuseReason" v-model="inspect.RefuseReason" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-inline" v-if="inspect.Status<=0">
                        <button id="btnSubmit" class="layui-btn layuiadmin-btn-list" type="button">
                            <i class="layui-icon layui-icon-ok-circle layuiadmin-button-btn"></i>确认检测
                        </button>
                    </div>
                </div>
            </div>
        </div>

        <div class="layui-card">
            <div class="layui-card-body">
                <table id="table" lay-filter="table"></table>
            </div>
        </div>
    </div>
</script>

<script type="text/html" id="selStatusTpl">
    <input type="checkbox" name="Status" productid="{{d.PkId}}" lay-skin="switch" lay-filter="switchStatus" lay-text="正常|异常" {{ d.Status <= 1 ?  'checked' : '' }}>
</script>

@section Scripts{
    <script>
        var vm = new Vue({
            el: "#page",
            template: "#tplPage",
            data: {
                lang: JSON.parse(lang).package,
                packNo: "@ViewBag.PackNo",
                inspect: {}
            }
        });
        setTimeout(function () {
            initLayui();
        }, 50);

        function initLayui() {
            layui.use(['table', 'layer', 'form', 'laydate'], function () {
                var layer = layui.layer,
                    table = layui.table,
                    form = layui.form,
                    laydate = layui.laydate;
                laydate.render({
                    elem: '#txtRangeDate'
                    , range: '至'
                });
                var options = {
                    elem: '#table'
                    , url: '/WorkOrder/GetPackInspect'
                    , method: "post"
                    , where: { packNo: "@ViewBag.PackNo" }
                    , page: {
                        limit: 50
                        , limits: [30, 40, 50, 100]
                    }
                    , parseData: function (res) {
                        for (var i = 0; i < res.Data.Products.length; i++) {
                            res.Data.Products[i].Status = res.Data.Products[i].Status <= 0 ? 1 : res.Data.Products[i].Status;
                        }
                        vm.$data.inspect = res.Data;
                        setTimeout(function () {
                            form.render("select");
                        }, 100);
                        return { ErrCode: res.ErrCode, ErrMsg: res.ErrMsg, Data: res.Data.Products };
                    }
                    , response: {
                        statusName: 'ErrCode'
                        , statusCode: 200
                        , msgName: 'ErrCode'
                        , countName: 'TotalCount'
                        , dataName: 'Data'
                    }
                    , cols: [[
                        { title: '序号', type: "numbers", width: 60, fixed: "left" }
                        , { field: 'BarCode', title: '组件条码', minWidth: 200, fixed: "left" }
                        , { field: 'WorkOrderNo', title: '工单号', minWidth: 200 }
                        , { field: 'OrderNo', title: '订单号', minWidth: 150 }
                        , { field: 'QLevel', title: '判定等级', minWidth: 100 }
                        , {
                            title: '接线盒照片', minWidth: 180, templet: function (d) {
                                var str = "";
                                if (d.BoxImage != "") {
                                    str = "<a target='blank' href='/Common/GetImage?url=" + encodeURIComponent(d.BoxImage) + "'><image src='/Common/GetImage?url=" + encodeURIComponent(d.BoxImage) + "'/></a>\
                                           <a target='blank' href='/Common/Download?url=" + encodeURIComponent(d.BoxImage) + "' class='layui-btn layui-btn-sm layui-btn-normal'><i class='layui-icon'>&#xe601;</i></a>";
                                }
                                return str;
                            }
                        }
                        , {
                            title: 'IV照片', minWidth: 180, templet: function (d) {
                                var str = "";
                                if (d.IvImage != "") {
                                    str = "<a target='blank' href='/Common/GetImage?url=" + encodeURIComponent(d.IvImage) + "'><image src='/Common/GetImage?url=" + encodeURIComponent(d.IvImage) + "'/></a>\
                                           <a target='blank' href='/Common/Download?url=" + encodeURIComponent(d.IvImage) + "' class='layui-btn layui-btn-sm layui-btn-normal' style='margin-top:-27px;'><i class='layui-icon'>&#xe601;</i></a>";
                                }
                                return str;
                            }
                        }
                        , {
                            title: 'EL2照片', minWidth: 180, templet: function (d) {
                                var str = "";
                                if (d.EL2Image != "") {
                                    str = "<a target='blank' href='/Common/GetImage?url=" + encodeURIComponent(d.EL2Image) + "'><image src='/Common/GetImage?url=" + encodeURIComponent(d.EL2Image) + "'/></a>\
                                           <a target='blank' href='/Common/Download?url=" + encodeURIComponent(d.EL2Image) + "' class='layui-btn layui-btn-sm layui-btn-normal' style='margin-top:-27px;'><i class='layui-icon'>&#xe601;</i></a>";
                                }
                                return str;
                            }
                        }
                        , {
                            title: '操作', width: 100, fixed: "right", templet: "#selStatusTpl"
                        }
                    ]]
                };

                $("#btnSearch").click(function () {
                    queryTable();
                });
                queryTable();
                function queryTable() {
                    options.page.curr = 1;
                    options.where.packNo = $("#txtPackNo").val().trim();
                    vm.$data.packNo = $("#txtPackNo").val().trim();

                    if (table.index <= 0) {
                        table.render(options);
                    } else {
                        table.reload("table", options);
                    }
                }

                $(document).on("click", "#btndownload", function () {
                    if (!window.parent.getConnectionStatus()) {
                        layer.msg("本地工具已断开，请打开本地“MES本地工具”，如未安装，请点击屏幕右上角“下载本地工具”", { icon: 5 });
                        return;
                    }
                    window.parent.layui.layer.open({
                        type: 1,
                        content: '<div style="padding: 50px;">后台正在下载图片，下载完成后将自动打开，请稍后...</div>',
                    });
                    window.parent.parent.sendMessage(JSON.stringify({
                        Command: "DownloadImages",
                        Body: {
                            ByType: 1,
                            Codes: [vm.packNo],
                            SiteTypes: [2,4,5]
                        }
                    }));
                });

                form.on('switch(switchStatus)', function (obj) {
                    var productId = parseInt($(obj.elem).attr("productid"));
                    for (var i = 0; i < vm.inspect.Products.length; i++) {
                        if (vm.inspect.Products[i].PkId == productId) {
                            vm.inspect.Products[i].Status = obj.elem.checked ? 1 : 2;
                            break;
                        }
                    }
                    console.log(obj);
                });

                $(document).on("click", "#btnSubmit", function () {
                    if ($("#selStatus").val() == null) {
                        layer.msg("请选择检测结果", { icon: 5 });
                        return;
                    }
                    vm.$data.inspect.Status = parseInt($("#selStatus").val());
                    vm.$data.inspect.RefuseReason = $("#txtRefuseReason").val().trim();
                    vm.$data.inspect.Products = table.cache.table;

                    var loadId = layer.load();
                    $.ajax({
                        url: "/WorkOrder/SaveVerification",
                        data: {
                            model: vm.$data.inspect
                        },
                        complete: function () {
                            layer.close(loadId);
                        },
                        success: function (res) {
                            if (res.ErrCode != 200) {
                                layer.msg(res.ErrMsg, { icon: 5 });
                                return;
                            }
                            layer.msg("检测成功！", { icon: 6 });
                        }
                    });
                });
            });
        }
    </script>
}
